<html
    xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">

    <ui:composition template="layout.xhtml">

        <ui:define name="title">
            Saída
        </ui:define>
        <ui:define name="content">
            <h:form id="saidaForm">

                <p:messages id="saidaMessages" autoUpdate="true" />

                <p:fieldset legend="Dados" id="saidaPanel" >

                    <div class="row">
                        <div class="column2">
                            <p:outputLabel value="Tipo da Saída" for="tipoSaidaAutoComplete" />
                        </div>
                        <div class="column3">
                            <p:autoComplete id="tipoSaidaAutoComplete" value="#{ managerCriarSaida.saida.tipoSaida }"
                                            forceSelection="true" dropdown="true" var="tipoSaida" itemValue="#{ tipoSaida }" 
                                            itemLabel="#{ tipoSaida.descricao }" completeMethod="#{ managerCriarSaida.autocompletarTipoSaida }"
                                            converter="conversortiposaida" minQueryLength="3" required="true" requiredMessage="Tipo da Saída é obrigatório">
                            </p:autoComplete>
                        </div>

                        <div class="column3">
                            <p:outputLabel value="Data da Saída" for="dataSaidaInputText" />
                        </div>
                        <div class="column3">
                            <p:calendar id="dataSaidaInputText" value= "#{ managerCriarSaida.saida.dataSaida }"
                                        showOn="button" pattern="dd/MM/yyyy" locale="pt" navigator="true"
                                        required="true" requiredMessage="Data do Saída é obrigatório"/>
                        </div>
                    </div>

                    <div class="row">
                        <div class="column2">
                            <p:outputLabel value="Valor da Saída" for="valorTotalCartorioInputText" />
                        </div>
                        <div class="column3">
                            <p:inputText id="valorTotalCartorioInputText"
                                         required="true" requiredMessage="Valor da Saída é obrigatório"
                                         value="#{ managerCriarSaida.saida.valor }"
                                         onkeypress="jQuery(this).autoNumeric({aSign:'R$ ', aSep: '.', aDec: ','} );">
                                <f:convertNumber type="currency" locale="pt-BR" />
                            </p:inputText>
                        </div>
                    </div>

                    <div class="row">
                        <div class="column2">
                            <p:outputLabel value="Descrição" for="descricaoInputTextarea" />
                        </div>
                        <div class="column9">
                            <p:inputTextarea id="descricaoInputTextarea"
                                             value="#{ managerCriarSaida.saida.descricao }" required="true"
                                             requiredMessage="Descrição é obrigatório"/>
                        </div>
                    </div>

                </p:fieldset>
                
                <div class="command">
                    <p:commandButton actionListener="#{ managerCriarSaida.salvar() }"
                                     value="Salvar" update="@form" oncomplete="widthFix();"
                                     styleClass="ui-priority-primary" 
                                     icon="ui-icon-disk"/>
                    <p:button value="Cancelar" icon="ui-icon-cancel" href="pesquisarSaida.xhtml" />
                </div>                
                
            </h:form>

        </ui:define>
    </ui:composition>

</html>